﻿@using Application.Dto
@model UserLogin

<form method="post" asp-action="Login" asp-controller="Login" v-on:submit.prevent="handleSubmit">
    <div>
        <table cellspacing=0 cellpadding=0 width=900 align=center border=0>
            <tbody>
                <tr>
                    <td style="height: 105px">
                        <img src="images/login_11.gif" border=0>
                    </td>
                </tr>
                <tr>
                    <td background=images/login_22.jpg height=300>
                        <table height=300 cellpadding=0 width=900 border=0>
                            <tbody>
                                <tr>
                                    <td colspan=2 height=35></td>
                                </tr>
                                <tr>
                                    <td width=360></td>
                                    <td>
                                        <table cellspacing=0 cellpadding=2 border=0>
                                            <tbody>
                                                <tr>
                                                    <td style="height: 28px" width=80>
                                                        登 录 名：
                                                    </td>
                                                    <td style="height: 28px" width=300>
                                                        <input asp-for="@Model.UName" style="width: 130px" v-model="user.UName" />
                                                        <span asp-validation-for="@Model.UName" style="color:red"></span>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td style="height: 28px">
                                                        登录密码：
                                                    </td>
                                                    <td style="height: 28px" width=300>
                                                        <input asp-for="@Model.UPassWord" style="width: 130px" type="password" v-model="user.UPassWord" />
                                                        <span asp-validation-for="@Model.UPassWord" style="color:red"></span>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td style="height: 18px"></td>
                                                    <td style="height: 18px"></td>
                                                    <td style="height: 18px"></td>
                                                </tr>
                                                <tr>

                                                    <td>
                                                        <input type="submit" value="登录" style="cursor: pointer;" />
                                                    </td>
                                                </tr>
                                            </tbody>
                                        </table>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </td>
                </tr>
                <tr>
                    <td>
                        <img src="images/login_33.jpg" border=0>
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
</form>
<style type=text/css>
    body {
        font-size: 12px;
        color: #ffffff;
        font-family: 宋体
    }

    td {
        font-size: 12px;
        color: #ffffff;
        font-family: 宋体
    }
</style>
@* <script type="module">
    // import { createApp, ref } from 'vue';
    // import { ElMessage } from 'element-plus';
    // import ElementPlus from 'element-plus';
    import { createApp, ref } from 'https://unpkg.com/vue@next';
    import { ElMessage } from 'https://unpkg.com/element-plus';
    import ElementPlus from 'https://unpkg.com/element-plus';

    var app = createApp({
        setup() {
            const user = ref({
                UName: '',
                UPassWord: ''
            });

            const handleSubmit = () => {
                if (!user.value.UName || !user.value.UPassWord) {
                    ElMessage({
                        message: '登录名和密码不能为空！',
                        type: 'warning'
                    });
                    return false; // 阻止表单提交
                }
                // 如果验证通过，可以在这里处理表单提交的逻辑
                // 例如：使用axios发送请求等
            };

            return {
                user,
                handleSubmit
            };
        }
    });

    app.use(ElementPlus);
    app.mount("#app");
</script> *@
